<template>
  <el-form ref="form" :model="job" label-width="100px">
    <el-form-item label="职位名称">
      <el-input v-model="job.name"></el-input>
    </el-form-item>
    <el-form-item label="基本工资">
      <el-input v-model="job.baseSalary"></el-input>
    </el-form-item>
    <el-form-item label="全勤奖金">
      <el-input v-model="job.award"></el-input>
    </el-form-item>
    <el-form-item label="缺勤扣除/天">
      <el-input v-model="job.deduction"></el-input>
    </el-form-item>
    <el-form-item label="详细描述">
      <el-input
        type="textarea"
        v-model="job.remark"
        style="width: 500px"
      ></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="onSubmit">立即添加</el-button>
      <el-button @click="reset">取消</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  name: "AddZhiWei",
  data() {
    return {
      job: {
        name: "",
        remark: "",
        award: "",
        baseSalary: "",
        deduction: "",
      },
    };
  },
  methods: {
    reset() {
      this.job.name = "";
      this.job.remark = "";
      this.job.baseSalary = "";
      this.job.award = "";
      this.job.deduction = "";
    },
    onSubmit() {
      console.log("submit!");
      if (
        this.job.name != "" &&
        this.job.remark != "" &&
        this.job.baseSalary != "" &&
        this.job.award != "" &&
        this.job.deduction != ""
      ) {
        this.$request
          .post("job/insert", {
            name: this.job.name,
            remake: this.job.remark,
            baseSalary: this.job.baseSalary,
            award: this.job.award,
            deduction: this.job.deduction,
          })
          .then((res) => {
            if (res.data.obj) {
              this.$message.success("添加成功！");
              this.reset();
            } else {
              this.$message.warning("添加失败！");
            }
          });
      } else {
        this.$message.error("请输入完整再次尝试！");
      }
    },
  },
};
</script>

<style scoped>
.el-input {
  width: 400px;
}
</style>
